<html>
    <head>
        <title>jQuery表单验证</title>
        <style>
            .star{
                color: red;
            }
            .dt{
                padding-top: 10px;
            }
        </style>
        <script src="./js/jquery-3.6.0.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function(){
                $("form :input.required").each(function(){
                    var $required = $("<strong class='star'>*</strong>");
                    $(this).parent().append($required);
                })
                $("forn :input").blur(function(){
                    if($(this).is("#username")){
                        if($(this).val() == ""){
                            alert("用户名不能为空！");
                        }
                    }
                    if($(this).is("#pwd")){
                        if($(this).val() == ""){
                            alert("密码不能为空！");
                        }
                        if(this.value.length < 8){
                            alert("密码不能小于8位，请重新输入！");
                        }
                    }
                })
            })
        </script>
    </head>
    <body>
        <form>
            <H3 align="center">用户注册</H3>
                <div class="dt">
                    用户名：<input type="text" id="username" name="username" size=20 class="required" />
                </div>
                <div class="dt">
                    密&nbsp;&nbsp;码：<input type="password" id="pwd" name="pwd" size=20 class="required" />
                </div>
                <div class="dt">
                    电&nbsp;&nbsp;话：<input type="text" id="phone" name="phone" size=11 maxLength=11 />
                </div>
                <div class="dt">
                    地&nbsp;&nbsp;址：<input type="text" id="address" name="address" size=20 maxLength=20 />
                </div>
                <div>
                    <input type="submit" name="sub" volue="注册" />
                </div>
        </form>
    </body>
</html>